import React, { Component } from 'react';
import {
    View,
    Text,
    ListView,
} from 'react-native';


import Icon from 'react-native-vector-icons/Ionicons';
import { mapbusStyle as styles } from '../../../styles';
var Dimensions = require('Dimensions');
var width = Dimensions.get('window').width;
var height = Dimensions.get('window').height;


const ds = new ListView.DataSource({ rowHasChanged: (r1, r2) => r1 !== r2 });
export default class Bus_list extends Component {
    // 初始化模拟数据
    constructor(props) {
        super(props);
    }
    render() {
        let steps = [];
        if(this.props.steps){
            steps = this.props.steps;
        }
        let dataSource = ds.cloneWithRows(steps)
        return (
            <View style={styles.busnumin}>
                <ListView
                    enableEmptySections={true}
                    dataSource={dataSource}
                    renderRow={this.renderRow.bind(this)}
                    onEndReachedThreshold={1}
                    horizontal={true}
                    contentContainerStyle={styles.busnumlist}
                />

            </View>
        );
    }

    _renderIcon(stepType){
        if(stepType=="ESTEP_BUS"||stepType=="ESTEP_COACH"||stepType=="BUSLINE"){//公交、巴士
            return(
                <Icon
                name={'md-bus'}
                size={20}
                color={'#3d9ccc'} style={styles.busicon} />
            )
        }else if(stepType=="ESTEP_TRAIN"){//火车
            return(
                <Icon
                name={'md-bus'}
                size={20}
                color={'#3d9ccc'} style={styles.busicon} />
            )
        }else if(stepType=="ESTEP_PLANE"){//飞机
            return(
                <Icon
                name={'md-bus'}
                size={20}
                color={'#3d9ccc'} style={styles.busicon} />
            )
        }else if(stepType=="ESTEP_DRIVING"){//驾车
            return(
                <Icon
                name={'md-bus'}
                size={20}
                color={'#3d9ccc'} style={styles.busicon} />
            )
        }else if(stepType=="ESTEP_WALK"||stepType=="WAKLING"){//步行
            return(
                <Icon
                name={'md-bus'}
                size={20}
                color={'#3d9ccc'} style={styles.busicon} />
            )
        }else if(stepType=="SUBWAY"){//地铁
            return(
                <Icon
                name={'md-bus'}
                size={20}
                color={'#3d9ccc'} style={styles.busicon} />
            )
        }
    }


    renderRow(rowData) {
        return (
            <View style={styles.bustwo}>
                {
                    this._renderIcon(rowData.stepType)
                }
                <Text style={styles.busnumber}>{rowData.vehicleName?rowData.vehicleName:rowData.entrance}</Text>
            </View>
        )
    }
}